<template>
  <view class="ss-flex ss-col-center notice-wrap">
    <image class="icon-img" :src="sheep.$url.cdn(data.src)" mode="heightFix"></image>
    <su-notice-bar
      style="flex: 1"
      :showIcon="false"
      scrollable
      single
      :text="data.title.text"
      :speed="50"
      :color="data.title.color"
      @tap="sheep.$router.go(data.url)"
    ></su-notice-bar>
    <!-- <view class="kefu">
      <button  open-type="contact" class="btn">
						
			</button>
      <view class="keview">
        <image
          src="/static/kefu.png"
          mode=""
          class="keicon"
        />
        <text>客服</text>
      </view>
    </view> -->
  </view>
</template>

<script setup>
  /**
   * 装修组件  - 通知栏
   *
   */
  import sheep from '@/sheep';
  const props = defineProps({
    data: {
      type: Object,
      default() {},
    },
  });
</script>

<style lang="scss" scoped>
  .notice-wrap {
    padding: 20rpx 0;
    .icon-img {
      height: 60rpx;
    }
  }
  .kefu{
    width: 100rpx;
    position: relative;
    height: 100%;
    margin-right: 10rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    .keicon{
      width: 65rpx;
      height: 65rpx;
    }
    .keview{
      position: relative;
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text{
        color: #333;
        font-size: 23rpx;
        font-weight: 500;
      }
    }
    // /deep/button:after {
    //   border: none;
    // }
  }
  .btn{
				position: absolute;
				background-color: transparent;
				width: 100%;
				height: 100%;
				z-index: 1;
				left: 0;
				border: none !important;
			}
		// 	/deep/ button::after  {
		// 	border: none;
		// }

</style>
<style>
.kefu button:after {
      border: none;
  }
</style>
